<div class="home_header">
      			<div class="unit on_3 columns">
      				<div class="fixed column logo" style="width:405px;"></div>
      				<!-- 
      				<div class="fixed column" style="width:168px;">
      					<ul class="sf-menu" > 
                				<li>                  				
                  				<a href="#" class="sf-menu_top">&nbsp;</a>       
      	            			<ul>
      	              			<?php foreach($navs as $key => $val):?>
      	                			<li>
      	                  				<a href="<?=site_url("?c=home&l1={$val['nav']['id']}")?>"><?= $val['nav']['nav'] ?></a>
      	                  				<?php $children = $val['children']; ?>
      	                  				<?php if(!empty($children)):?>
      		                  				<ul>
      		                  				<?php foreach($children as $sub_nav):?>
      		                    					<li><a href="<?=site_url("?c=home&l1={$sub_nav['nav']['sid']}&l2={$sub_nav['nav']['id']}")?>"><?= $sub_nav['nav']['nav']?></a></li>
      			                  			<?php endforeach;?>
      			                 	 		</ul>
      		                  			<?php endif;?>                                   
      		                 		</li>
      		              		<?php endforeach;?>
      		            			<li class="sf-menu_bottom"><a>&nbsp;</a></li>                        
      		              		</ul>
      		            	</li>
      	        		</ul>
      				</div>
      				-->      				 
      				<div id="menu_wraper" class="fixed column dbx-box" style="width:200px;">
                		<div id="btn_menu" class="topmn_show"></div> <!--class="dbx-handle"-->
            			<div id="menu" class="menuTree dbx-content">
              				<ul>
                				<li class="parent collapsed"><a href="#" mce_href="#">Animals</a>
                      				<ul>
                        				<li class="child"><a href="dog" mce_href="dog" >dog</a></li> 
                        				<li class="child"><a href="cat" mce_href="cat">cat</a></li> 
                        				<li class="child"><a href="duck" mce_href="duck">duck</a></li> 
                      				</ul> 
                				</li> 
                				<li class="parent collapsed"><a href="#" mce_href="#">Dong vat</a>
                  					<ul>
				                        <li class="child"><a href="dog" mce_href="dog" >Cho</a></li> 
				                        <li class="child"><a href="cat" mce_href="cat">Meo</a></li> 
				                        <li class="child"><a href="duck" mce_href="duck">Ga</a></li> 
				                 	</ul> 
                				</li> 
			                    <li class="parent collapsed"><a href="#" mce_href="#">Dong vat</a>
				                	<ul>
				                        <li class="child"><a href="dog" mce_href="dog" >Cho</a></li> 
				                        <li class="child"><a href="cat" mce_href="cat">Meo</a></li> 
				                        <li class="child"><a href="duck" mce_href="duck">Ga</a></li> 
				                    </ul> 
			                    </li> 
                				<!--<li class="parent">&nbsp;</li>-->
              				</ul> 
            			</div>
              		</div>
      				<div class="fixed column" style="width:280px; margin:15px 15px 0px 100px; text-align:right;">
      					<div>
	      					<p class="audio column"><a href="#">Audio off</a></p>
	      					<p class="column">
	      						<select class="styled" name="abc" style="width:112px;">
	      							<option value="1">Vietnamese</option>
	      							<option value="1">English</option>
	      						</select>
	      					</p>
	      					<p class="column login_register"><a id="login_form_link" href="#">Login</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#">Register</a></p>
	      					<div class="clear"></div>
	      				</div>	      				
	      				<div id="login_form" class="items_input" style="width:250px; margin-left: 23px;display: none;">
	      					<table>
	      						<tr>
	      							<td><input name="Username" value="Username" type="text"/></td>
	      							<td><input name="Password" value="Password" type="text"/></td>
	      							<td><span class="go"><a href="#">&nbsp;</a></span></td>
	      						</tr>
	      						<tr>
	      							<td><input name="" type="checkbox"/><span class="distance">Remember me</span></td>
	      							<td colspan="2"><span style="color:#FFF; font-weight:bolder; font-size:11px;">Forgot password?</span></td>
	      						</tr>
	      					</table>
	      				</div>
	      				<div style="text-align: right; padding-right: 1px;">
      						<input name="Search" value="Search Dodge.com" type="text"/>
      						<span class="go"><a href="#">&nbsp;</a></span>
      					</div>
      				</div>
      			</div>
      		</div>
			
			
/**********************/

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<link href="css/style.css" rel="stylesheet" type="text/css" />
	<link href="css/superfish.css" rel="stylesheet" type="text/css" />
	<link href="css/dbx.css" rel="stylesheet" type="text/css" />
	
	<script src="js/jquery-1.3.2.js"></script>
	<script src="js/jquery.menutree.js"></script>
</head>
<body>
<!--<body style="background-image: url('images/bg_f.gif'); ">-->
	<div id="menu_wraper" class="dbx-box" style="padding-left: 100px;">
		<div id="btn_menu" class="topmn_show"></div> <!--class="dbx-handle"-->
		<div id="menu" class="menuTree dbx-content">
			<ul>
				<li class="parent collapsed"><a href="#" mce_href="#">Animals</a>
					<ul>
						<li class="child"><a href="dog" mce_href="dog" >dog</a></li> 
						<li class="child"><a href="cat" mce_href="cat">cat</a></li> 
						<li class="child"><a href="duck" mce_href="duck">duck</a></li> 
					</ul> 
				</li> 
				<li class="parent collapsed"><a href="#" mce_href="#">Dong vat</a>
					<ul>
						<li class="child"><a href="dog" mce_href="dog" >Cho</a></li> 
						<li class="child"><a href="cat" mce_href="cat">Meo</a></li> 
						<li class="child"><a href="duck" mce_href="duck">Ga</a></li> 
					</ul> 
				</li> 
				<li class="parent collapsed"><a href="#" mce_href="#">Dong vat</a>
					<ul>
						<li class="child"><a href="dog" mce_href="dog" >Cho</a></li> 
						<li class="child"><a href="cat" mce_href="cat">Meo</a></li> 
						<li class="child"><a href="duck" mce_href="duck">Ga</a></li> 
					</ul> 
				</li> 
				<!--<li class="parent">&nbsp;</li>-->
			</ul> 
		</div>
	<div>
		
	<!--
	<div id="menu_wraper" class="dbx-box" style="padding-left: 100px;">
		<h3 class="dbx-handle">Menu</h3>
		<div id="menu" class="menuTree dbx-content">
			<ul>
				<li class="parent collapsed"><a href="#" mce_href="#">Animals</a>
					<ul>
						<li class="child"><a href="dog" mce_href="dog" >dog</a></li> 
						<li class="child"><a href="cat" mce_href="cat">cat</a></li> 
						<li class="child"><a href="duck" mce_href="duck">duck</a></li> 
					</ul> 
				</li> 
				<li class="parent collapsed"><a href="#" mce_href="#">Dong vat</a>
					<ul>
						<li class="child"><a href="dog" mce_href="dog" >Cho</a></li> 
						<li class="child"><a href="cat" mce_href="cat">Meo</a></li> 
						<li class="child"><a href="duck" mce_href="duck">Ga</a></li> 
					</ul> 
				</li> 
				<li class="parent collapsed"><a href="#" mce_href="#">Dong vat</a>
					<ul>
						<li class="child"><a href="dog" mce_href="dog" >Cho</a></li> 
						<li class="child"><a href="cat" mce_href="cat">Meo</a></li> 
						<li class="child"><a href="duck" mce_href="duck">Ga</a></li> 
					</ul> 
				</li> 
			</ul> 
		</div>
	<div>
	-->
	<script>
		$(document).ready(function() {
			$('#menu').menuTree({
				menuEvent: 'mouseover',
				//expandSpeed: -1
			});
			
			$('#btn_menu').click(function() {
				var self = $(this);
				if (self.hasClass('topmn_show')) {
					$('#menu').slideUp("slow", function() {
						self.removeClass('topmn_show');
						self.addClass('topmn_hide');
					});					
				}
				else if (self.hasClass('topmn_hide')) {
					self.removeClass('topmn_hide');
						self.addClass('topmn_show');
					$('#menu').slideDown("slow", function() {
						
					});
					
				}
				
			});			
		});		
	</script>
</body>
</html>